import { Component } from '@angular/core';


@Component({
  selector: 'form-test',
  template: `
    <form>
      <input type="text" name="contactName" [ngModel]="curContact.name" />
      <input type="text" name="contactName" [(ngModel)]="curContact.name" />
      <input type="radio" name="sex" [(ngModel)]="curContact.sex" value="famale"/> 女
      <input type="radio" name="sex" [(ngModel)]="curContact.sex" value="male"/> 男
      <input type="checkbox" name="lock" [(ngModel)]="curContact.lock"/> 禁用
      <select name="interestValue" [(ngModel)]="curContact.interestValue">
        <option *ngFor="let interest of interests" [value]="interest.value">
          {{interest.value}}
        </option>
      </select>
      <select multiple name="interestMul" [(ngModel)]="curContact.interestMul">
        <option *ngFor="let interest of interests" [value]="interest.value">
          {{interest.display}}
        </option>
      </select>
    </form>
  `
})

export class FormComponent {
  curContact = {
    name: '',
    sex: 'male',
    lock: '',
    interestValue: '',
    interestMul: '',
  };
  interests: any[] = [
    {value: 'reading', display: '阅读'},
    {value: 'traveling', display: '旅游'},
    {value: 'sport', display: '运动'}
  ];
}
